page{
    height: 100%;
    }
.helpValue {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, #04D2C3 , #E9ECFF 50%);
    .top {
        padding: 5vw 0 3vw 0;
        .show {
            margin: 0 auto;
            width: 35vw;
            height: 35vw;
            border-radius: 35vw;
            position: relative;
            box-sizing: border-box;
            background-image: url('//resource.160nurse.com/canvas/healthy/img/activity/help_bg.png');
            background-size: 28vw 40vw;
            background-repeat: repeat-x;
            background-position-y: 15vw;
            // background-position: 3vw 20vw;
            animation: helpValBg 60s linear infinite;
            .round {
                width: 35vw;
            }
            .bubble1 {
                width: 2vw;
                position: absolute;
                // top: 20vw;
                left: 15vw;
                animation: bubbleMove1 5s 1s linear infinite;
            }
            .bubble2 {
                width: 2vw;
                position: absolute;
                left: 13vw;
                animation: bubbleMove1 4s linear infinite;
            }
            .bubble3 {
                width: 2vw;
                position: absolute;
                left: 16vw;
                animation: bubbleMove1 5s linear infinite;
            }
            .bubble4 {
                width: 2vw;
                position: absolute;
                left: 19vw;
                animation: bubbleMove1 6s linear infinite;
            }
        }
        .num {
            margin: 2vw 0 0.5vw 0;
            font-size: 6vw;
            color: #FFB937;
            text-align: center;
        }
        .tip {
            color: #fff;
            font-size: 3.73vw;
            text-align: center;
        }
    }
    .helpList {
        padding: 5vw 0;
        border-radius: 5vw 5vw 0 0;
        background-color: #fff;
        .li{
            overflow: hidden;
            padding: 3vw 5vw;
            border-bottom: 1px solid #F5F5F5;
            .left {
                float: left;
                .reason {
                    font-size: 3.73vw;
                    color: #333;
                }
                .data {
                    font-size: 3.2vw;
                    color: #999;
                }
            }
            .right {
                padding-top: 2vw;
                float: right;
                color: #FFA229;
                font-size: 3.73vw;
            }
        }
    }
}
@keyframes helpValBg {
    0% { background-position-x: 0vw; }
    50% { background-position-x: 200vw; }
    100% { background-position-x: 400vw; }
}
// 50%   15vw
@keyframes bubbleMove1 {
    0% {
        bottom: 0vw;
        opacity: 0;
        transform: scale(0.5)
    }
    25% {
        bottom: 4vw;
        opacity: 0.3;
        transform: scale(0.6)
    }
    50% {
        bottom: 7.5vw;
        opacity: 0.5;
        transform: scale(0.8)
    }
    75% {
        bottom: 11vw;
        opacity: 0.8;
        transform: scale(1)
    }
    100% {
        bottom: 14vw;
        opacity: 1;
        transform: scale(1.2)
    }
}
// 25%    22vw
@keyframes bubbleMove2 {
    0% {
        bottom: 0vw;
        opacity: 0;
        transform: scale(0.5)
    }
    25% {
        bottom: 5vw;
        opacity: 0.3;
        transform: scale(0.6)
    }
    50% {
        bottom: 10.5vw;
        opacity: 0.5;
        transform: scale(0.8)
    }
    75% {
        bottom: 16vw;
        opacity: 0.8;
        transform: scale(1)
    }
    100% {
        bottom: 21vw;
        opacity: 1;
        transform: scale(1.2)
    }
}
// 75%    8vw
@keyframes bubbleMove3 {
    0% {
        bottom: 0vw;
        opacity: 0;
        transform: scale(0.5)
    }
    25% {
        bottom: 2vw;
        opacity: 0.25;
        transform: scale(0.6)
    }
    50% {
        bottom: 4vw;
        opacity: 0.5;
        transform: scale(0.8)
    }
    75% {
        bottom: 6vw;
        opacity: 0.75;
        transform: scale(1)
    }
    100% {
        bottom: 8vw;
        opacity: 1;
        transform: scale(1.2)
    }
}